<template>
  <div class="questions">
      <!-- 用户 提问 -->
        <div class="questions_answers_user">
            <div class="user_time" v-if="chatTime">{{ chatTime }}</div>
            <div class="user_bubble">
                <div class="user_bubble_left">
                    <div class="user_bubble_info">{{ userText }}</div>
                </div>
                <div class="user_bubble_right">
                    <div class="user_head_portrait">
                        <img :src="userImg"
                            :title="userInfo.userName"
                            :alt="userInfo.userName"
                            @error="handleError">
                    </div>
                    <div class="user_name">{{ userInfo.userName }}</div>
                </div>
            </div>
        </div>
  </div>
</template>

<script>
import getTime from '@/utils/getTime.js'
import userImg from '@/assets/image/user.png'
import {mapState} from 'vuex'
import dayjs from "dayjs";
import AesGcm from "@/utils/aesgcm";
export default {
    name: 'Questions',
    props:['userText'],
    data(){
        return {
            userImg,
            photoURL: '',
            chatTime: null,
        }
    },
    created(){
        if (dayjs().diff(this.$store.state.lastChatTime, 'minutes') >= 5) {
          this.chatTime = dayjs().format('HH:mm');
          this.$store.state.lastChatTime = dayjs();
        }
    },
    computed: {
        ...mapState(['userInfo']),
        getTimes(){
            return getTime();
        }
    },
    methods: {
        // 数据加载期间发生错误时触发
        handleError(event){
            event.target.src = this.userImg;
        }
    }
}
</script>
